<template>
  <div class="all" p-5>
    <div class="all-top">
      <div class="all-top-tittle">案件审批</div>
    </div>
    <!-- 立案 -->
    <div v-if="registerList && penaltyData?.status == 1">
      <div>
        <PenaltyInfo :id="route.query.id" :title="false" :useType="3"></PenaltyInfo>
        <div class="examine-body-box">
          <div class="examine-body-box-tittle">
            <div class="examine-body-box-tittle-left"></div>
            <div class="examine-body-box-tittle-right">审批信息</div>
          </div>
          <div class="examine-body-box-info">
            <a-form ref="formRef" :model="formState" :rules="rules" :label-col="labelCol">
              <a-row :gutter="24">
                <a-col class="gutter-row" :span="8">
                  <a-form-item label="审批结果" name="nodeStatus">
                    <a-radio-group v-model:value="formState.nodeStatus">
                      <a-radio :value="2">同意</a-radio>
                      <a-radio :value="3">不同意</a-radio>
                    </a-radio-group>
                  </a-form-item>
                </a-col>
              </a-row>
              <a-row :gutter="24" v-if="formState.nodeStatus == 2">
                <a-col class="gutter-row" :span="8">
                  <a-form-item label="主办人" name="sponsor">
                    <a-select
                      :value="penaltyData?.sponsor"
                      placeholder="请选择主办人"
                      :open="false"
                    >
                    </a-select>
                  </a-form-item>
                </a-col>
                <a-col class="gutter-row" :span="8" v-if="chooseFlag == 1">
                  <a-form-item label="协办人" name="organizerId">
                    <a-select
                      v-model:value="formState.organizerId"
                      placeholder="请选择协作人"
                      :options="organizerOptions"
                      allowClear
                    ></a-select>
                  </a-form-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col class="gutter-row" :span="8">
                  <a-form-item label="审批意见" :name="caseApproveOpinions(formState.nodeStatus)">
                    <a-textarea
                      v-model:value="formState.approveOpinions"
                      :rows="4"
                      placeholder="请输入审批意见"
                      :maxlength="128"
                      show-count
                    />
                  </a-form-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>
    </div>
    <!-- 立案且有立案审批记录 -->
    <div v-else-if="registerList && handleList && penaltyData?.status == 1">
      <a-tabs class="all-tabs" v-model:activeKey="activeKey">
        <a-tab-pane key="1" tab="案件信息">
          <PenaltyInfo :id="route.query.id" :title="false" :useType="3"></PenaltyInfo>
          <div class="examine-body-box">
            <div class="examine-body-box-tittle">
              <div class="examine-body-box-tittle-left"></div>
              <div class="examine-body-box-tittle-right">审批信息</div>
            </div>
            <div class="examine-body-box-info">
              <a-form ref="formRef" :model="formState" :rules="rules" :label-col="labelCol">
                <a-row :gutter="24">
                  <a-col class="gutter-row" :span="8">
                    <a-form-item label="审批结果" name="nodeStatus">
                      <a-radio-group v-model:value="formState.nodeStatus">
                        <a-radio :value="2">同意</a-radio>
                        <a-radio :value="3">不同意</a-radio>
                      </a-radio-group>
                    </a-form-item>
                  </a-col>
                </a-row>
                <a-row :gutter="24" v-if="formState.nodeStatus == 2">
                  <a-col class="gutter-row" :span="8" v-if="chooseFlag == 1">
                    <a-form-item
                      label="主办人"
                      name="sponsor"
                      :labelCol="{ style: { width: '82px' } }"
                    >
                      <a-select
                        :value="penaltyData?.sponsor"
                        placeholder="请选择主办人"
                        :open="false"
                      >
                      </a-select>
                    </a-form-item>
                  </a-col>
                  <a-col class="gutter-row" :span="8" v-if="chooseFlag == 1">
                    <a-form-item
                      label="协办人"
                      name="organizerId"
                      :labelCol="{ style: { width: '82px' } }"
                    >
                      <a-select
                        v-model:value="formState.organizerId"
                        placeholder="请选择协作人"
                        :options="organizerOptions"
                        allowClear
                      ></a-select>
                    </a-form-item>
                  </a-col>
                </a-row>
                <a-row :gutter="24">
                  <a-col class="gutter-row" :span="8">
                    <a-form-item label="审批意见" :name="caseApproveOpinions(formState.nodeStatus)">
                      <a-textarea
                        v-model:value="formState.approveOpinions"
                        :rows="4"
                        placeholder="请输入审批意见"
                        :maxlength="128"
                        show-count
                      />
                    </a-form-item>
                  </a-col>
                </a-row>
              </a-form>
            </div>
          </div>
        </a-tab-pane>
        <a-tab-pane key="2" tab="立案审批记录" force-render v-if="registerList?.length != 0">
          <DynamicTable
            :columns="columns"
            :data-request="loadData"
            bordered
            :search="false"
            :showToolBar="false"
            :pagination="false"
          />
        </a-tab-pane>
        <a-tab-pane key="3" tab="案件处理审批记录" v-if="handleList?.length != 0">
          <DynamicTable
            :columns="columns"
            :data-request="loadData2"
            bordered
            :search="false"
            :showToolBar="false"
            :pagination="false"
        /></a-tab-pane>
      </a-tabs>
    </div>
    <!-- 其他状态且有立案审批记录 -->
    <div v-else-if="registerList && penaltyData?.status != 1">
      <a-tabs class="all-tabs" v-model:activeKey="activeKey" @change="caseDetailApi()">
        <a-tab-pane key="1" tab="案件信息">
          <div class="archive">
            <div
              class="archive-steps"
              v-if="penaltyData?.status != '1' && penaltyData?.status != '5'"
            >
              <a-steps :current="caseStatus(penaltyData?.status)" :items="steps"></a-steps>
            </div>
            <div class="archive-body">
              <div class="archive-body-left" v-if="penaltyData?.stageList?.length != 0">
                <div class="taskBox" v-if="penaltyData?.taskId || penaltyData?.resultFileUrl">
                  <div class="taskBox-top" style="padding: 10px 12px">
                    <div>任务信息</div>
                    <a-button type="primary" ghost @click="goTask" v-if="penaltyData?.taskId"
                      >查看任务</a-button
                    >
                  </div>
                  <div class="taskBox-bottom" v-if="penaltyData?.resultFileUrl">
                    <BookCreate
                      :type="17"
                      :url="penaltyData?.resultFileUrl"
                      :newFileUrl="penaltyData?.resultFileUrl"
                      :isShow="false"
                      @getBookUrl="getBookUrl"
                    />
                  </div>
                </div>
                <!-- 立案审批表 -->
                <div class="taskBox">
                  <div class="taskBox-top">
                    <div>立案审批表</div>
                  </div>
                  <div class="taskBox-bottom">
                    <a-row>
                      <BookCreate
                        :type="13"
                        :caseId="route.query.id"
                        :url="lafileInfoData.oldFileUrl"
                        :newFileUrl="lafileInfoData.newFileUrl"
                        :caseFileId="lafileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                      />
                    </a-row>
                  </div>
                </div>
                <div class="taskBox" v-if="dcfileInfoData.fileType != ''">
                  <div class="taskBox-top">
                    <div>调查取证</div>
                  </div>
                  <div class="taskBox-bottom">
                    <!-- 调查取证通知书 -->
                    <a-row>
                      <BookCreate
                        :type="7"
                        :caseId="route.query.id"
                        :url="dcfileInfoData.oldFileUrl"
                        :newFileUrl="dcfileInfoData.newFileUrl"
                        :caseFileId="dcfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                    <!-- 权力义务告知书 -->
                    <a-row>
                      <BookCreate
                        :type="14"
                        :caseId="route.query.id"
                        :url="qlfileInfoData.oldFileUrl"
                        :newFileUrl="qlfileInfoData.newFileUrl"
                        :caseFileId="qlfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>

                    <!-- 先行登记保存决定书 -->
                    <a-row>
                      <BookCreate
                        :type="24"
                        :caseId="route.query.id"
                        :url="xxdjfileInfoData.oldFileUrl"
                        :newFileUrl="xxdjfileInfoData.newFileUrl"
                        :caseFileId="xxdjfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                    <!-- 调查取证其他文书 -->
                    <div v-if="dcqzfileInfoDataList != ''">
                      <a-row v-for="(item, index) in dcqzfileInfoDataList as any">
                        <BookCreate
                          :type="15"
                          :caseId="route.query.id"
                          :url="item.oldFileUrl"
                          :fileName="item.fileName"
                          :newFileUrl="item.newFileUrl"
                          :caseFileId="item.id"
                          :isShow="false"
                          @getBookUrl="getBookUrl"
                          v-if="index > 2"
                      /></a-row>
                    </div>
                  </div>
                </div>
                <div class="taskBox" v-if="cwfileInfoData.fileType != ''">
                  <div class="taskBox-top">
                    <div>询问笔录</div>
                  </div>
                  <div class="taskBox-bottom">
                    <!-- 询问通知书 -->
                    <a-row>
                      <BookCreate
                        :type="12"
                        :caseId="route.query.id"
                        :url="cwfileInfoData.oldFileUrl"
                        :newFileUrl="cwfileInfoData.newFileUrl"
                        :caseFileId="cwfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                    <!-- 询问笔录 -->
                    <a-row>
                      <BookCreate
                        :type="15"
                        :caseId="route.query.id"
                        :url="xwfileInfoData.oldFileUrl"
                        :newFileUrl="xwfileInfoData.newFileUrl"
                        :caseFileId="xwfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                    <div v-if="xwfileInfoDataList != ''">
                      <a-row v-for="(item, index) in xwfileInfoDataList as any">
                        <BookCreate
                          :type="15"
                          :caseId="route.query.id"
                          :url="item.oldFileUrl"
                          :fileName="item.fileName"
                          :newFileUrl="item.newFileUrl"
                          :caseFileId="item.id"
                          :isShow="false"
                          @getBookUrl="getBookUrl"
                          v-if="index > 1"
                      /></a-row>
                    </div>
                    <!-- <div class="noData" v-else>暂未上传</div> -->
                  </div>
                </div>
                <div class="taskBox" v-if="fzshfileInfoData.fileType != ''">
                  <div class="taskBox-top">
                    <div>法制审核</div>
                  </div>
                  <div class="taskBox-bottom">
                    <!-- 法制审核意见 -->
                    <a-row>
                      <BookCreate
                        :type="25"
                        :caseId="route.query.id"
                        :url="fzshfileInfoData.oldFileUrl"
                        :newFileUrl="fzshfileInfoData.newFileUrl"
                        :caseFileId="fzshfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                  </div>
                </div>
                <div class="taskBox" v-if="jtyafileInfoDataList != ''">
                  <div class="taskBox-top">
                    <div>集体议案</div>
                  </div>
                  <div class="taskBox-bottom" v-if="jtyafileInfoDataList != ''">
                    <a-row v-for="item in jtyafileInfoDataList as any">
                      <BookCreate
                        :type="19"
                        :caseId="route.query.id"
                        :url="item.oldFileUrl"
                        :fileName="item.fileName"
                        :newFileUrl="item.newFileUrl"
                        :caseFileId="item.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                  </div>
                  <div class="taskBox-bottom" v-else>
                    <div class="noData">暂未上传</div>
                  </div>
                </div>
                <div class="taskBox" v-if="otherInfoData != ''">
                  <div class="taskBox-top">
                    <div>其他</div>
                  </div>
                  <div class="taskBox-bottom" v-if="otherInfoData != ''">
                    <a-row v-for="item in otherInfoData as any">
                      <BookCreate
                        :type="19"
                        :caseId="route.query.id"
                        :url="item.oldFileUrl"
                        :fileName="item.fileName"
                        :newFileUrl="item.newFileUrl"
                        :caseFileId="item.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                  </div>
                  <div class="taskBox-bottom" v-else>
                    <div class="noData">暂未上传</div>
                  </div>
                </div>
                <div
                  class="taskBox"
                  v-if="
                    penaltyData?.status >= 2 &&
                    xzfileInfoData.fileType != '' &&
                    penaltyData?.handleWay == 2
                  "
                >
                  <div class="taskBox-top">
                    <div>处罚告知</div>
                  </div>
                  <div class="taskBox-bottom">
                    <a-row>
                      <BookCreate
                        :type="11"
                        :caseId="route.query.id"
                        :url="xzfileInfoData.oldFileUrl"
                        :newFileUrl="xzfileInfoData.newFileUrl"
                        :caseFileId="xzfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                  </div>
                </div>
                <div
                  class="taskBox"
                  v-if="xzcffileInfoData.fileType != '' || byxzcffileInfoData.fileType != ''"
                >
                  <div class="taskBox-top">
                    <div>处罚文书</div>
                  </div>
                  <div class="taskBox-bottom">
                    <a-row v-if="penaltyData?.handleWay == 2">
                      <BookCreate
                        :type="1"
                        :caseId="route.query.id"
                        :url="xzcffileInfoData.oldFileUrl"
                        :newFileUrl="xzcffileInfoData.newFileUrl"
                        :caseFileId="xzcffileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                      />
                      <BookCreate
                        :type="29"
                        :caseId="route.query.id"
                        :url="xzcfspileInfoData.oldFileUrl"
                        :newFileUrl="xzcfspileInfoData.newFileUrl"
                        :caseFileId="xzcfspileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                      />
                    </a-row>
                    <a-row v-if="penaltyData?.handleWay == 1">
                      <BookCreate
                        :type="27"
                        :caseId="route.query.id"
                        :url="byxzcffileInfoData.oldFileUrl"
                        :newFileUrl="byxzcffileInfoData.newFileUrl"
                        :caseFileId="byxzcffileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                  </div>
                </div>
                <div class="taskBox" v-if="yqfqfileInfoData.fileType != ''">
                  <div class="taskBox-top">
                    <div>延期/分期文书</div>
                  </div>
                  <div class="taskBox-bottom">
                    <a-row>
                      <BookCreate
                        :type="26"
                        :caseId="route.query.id"
                        :url="yqfqfileInfoData.oldFileUrl"
                        :newFileUrl="yqfqfileInfoData.newFileUrl"
                        :caseFileId="yqfqfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                      />
                      <BookCreate
                        :type="30"
                        :caseId="route.query.id"
                        :url="yqfqspfileInfoData.oldFileUrl"
                        :newFileUrl="yqfqspfileInfoData.newFileUrl"
                        :caseFileId="yqfqspfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                      />
                    </a-row>
                  </div>
                </div>
                <div
                  class="taskBox"
                  v-if="sdhzfileInfoData.fileType != '' || jnpzfileInfoData.fileType != ''"
                >
                  <div class="taskBox-top">
                    <div>归档文书</div>
                  </div>
                  <div class="taskBox-bottom">
                    <a-row>
                      <BookCreate
                        :type="16"
                        :caseId="route.query.id"
                        :url="sdhzfileInfoData.oldFileUrl"
                        :newFileUrl="sdhzfileInfoData.newFileUrl"
                        :caseFileId="sdhzfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                    <a-row v-if="jnpzfileInfoData?.fileType != ''">
                      <BookCreate
                        :type="22"
                        :caseId="route.query.id"
                        :url="jnpzfileInfoData?.oldFileUrl"
                        :newFileUrl="jnpzfileInfoData?.newFileUrl"
                        :caseFileId="jnpzfileInfoData?.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                  </div>
                </div>
                <div class="taskBox" v-if="zzajjtInfoDataList != ''">
                  <div class="taskBox-top">
                    <div>终止案件集体议案</div>
                  </div>
                  <div class="taskBox-bottom" v-if="zzajjtInfoDataList != ''">
                    <a-row v-for="item in zzajjtInfoDataList as any">
                      <BookCreate
                        :type="19"
                        :caseId="route.query.id"
                        :url="item.oldFileUrl"
                        :fileName="item.fileName"
                        :newFileUrl="item.newFileUrl"
                        :caseFileId="item.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                    /></a-row>
                  </div>
                  <div class="taskBox-bottom" v-else>
                    <div class="noData">暂未上传</div>
                  </div>
                </div>
                <div
                  class="taskBox"
                  v-if="zzajdcfileInfoData.fileType != '' && zzajspfileInfoData.fileType != ''"
                >
                  <div class="taskBox-top">
                    <div>终止文书</div>
                  </div>
                  <div class="taskBox-bottom">
                    <a-row>
                      <BookCreate
                        :type="28"
                        :caseId="route.query.id"
                        :url="zzajdcfileInfoData.oldFileUrl"
                        :newFileUrl="zzajdcfileInfoData.newFileUrl"
                        :caseFileId="zzajdcfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                      />
                      <BookCreate
                        :type="31"
                        :caseId="route.query.id"
                        :url="zzajspfileInfoData.oldFileUrl"
                        :newFileUrl="zzajspfileInfoData.newFileUrl"
                        :caseFileId="zzajspfileInfoData.id"
                        :isShow="false"
                        @getBookUrl="getBookUrl"
                      />
                    </a-row>
                  </div>
                </div>
              </div>
              <div
                class="archive-body-right"
                :style="changeWith(penaltyData?.taskId || penaltyData?.resultFileUrl)"
              >
                <PenaltyInfo
                  :id="route.query.id"
                  :title="false"
                  :queryType="3"
                  :useType="3"
                ></PenaltyInfo>
                <div class="examine-body-box">
                  <div class="examine-body-box-tittle">
                    <div class="examine-body-box-tittle-left"></div>
                    <div class="examine-body-box-tittle-right">审批信息</div>
                  </div>
                  <div class="examine-body-box-info">
                    <a-form ref="formRef" :model="formState" :rules="rules" :label-col="labelCol">
                      <a-row :gutter="24">
                        <a-col class="gutter-row" :span="8">
                          <a-form-item label="审批结果" name="nodeStatus">
                            <a-radio-group v-model:value="formState.nodeStatus">
                              <a-radio :value="2">同意</a-radio>
                              <a-radio :value="3">不同意</a-radio>
                            </a-radio-group>
                          </a-form-item>
                        </a-col>
                      </a-row>
                      <!-- <a-row :gutter="24" v-if="formState.nodeStatus == 2">
                        <a-col class="gutter-row" :span="8">
                          <a-form-item label="主办人" name="sponsor">
                            <a-select
                              :value="penaltyData?.sponsor"
                              placeholder="请选择主办人"
                              :open="false"
                            >
                            </a-select>
                          </a-form-item>
                        </a-col>
                        <a-col class="gutter-row" :span="8">
                          <a-form-item label="协办人" name="organizerId">
                            <a-select
                              v-model:value="formState.organizerId"
                              placeholder="请选择协作人"
                              :options="organizerOptions"
                              allowClear
                            ></a-select>
                          </a-form-item>
                        </a-col>
                      </a-row> -->
                      <a-row :gutter="24">
                        <a-col class="gutter-row" :span="8">
                          <a-form-item
                            label="审批意见"
                            :name="caseApproveOpinions(formState.nodeStatus)"
                          >
                            <a-textarea
                              v-model:value="formState.approveOpinions"
                              :rows="4"
                              placeholder="请输入审批意见"
                              :maxlength="128"
                              show-count
                            />
                          </a-form-item>
                        </a-col>
                      </a-row>
                    </a-form>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </a-tab-pane>
        <a-tab-pane key="2" tab="立案审批记录">
          <DynamicTable
            :columns="columns"
            :data-request="loadData"
            bordered
            :search="false"
            :showToolBar="false"
          />
        </a-tab-pane>
        <a-tab-pane key="3" tab="案件处理审批记录" v-if="handleList.length != 0">
          <DynamicTable
            :columns="columns"
            :data-request="loadData2"
            bordered
            :search="false"
            :showToolBar="false"
        /></a-tab-pane>
        <a-tab-pane key="4" tab="延期/分期审批记录" v-if="delayList.length != 0">
          <DynamicTable
            :columns="columns"
            :data-request="loadData3"
            bordered
            :search="false"
            :showToolBar="false"
            :pagination="false"
        /></a-tab-pane>
        <a-tab-pane key="5" tab="案件终止审批记录" v-if="cancelList.length != 0">
          <DynamicTable
            :columns="columns"
            :data-request="loadData4"
            bordered
            :search="false"
            :showToolBar="false"
            :pagination="false"
        /></a-tab-pane>
      </a-tabs>
    </div>

    <div class="bottomBox"></div>
    <div class="bottomBtns" style="z-index: 3">
      <a-space :size="12"
        ><a-button size="large" @click="cacel">取消</a-button>
        <a-button size="large" type="primary" @click="onSubmit">提交</a-button></a-space
      >
    </div>
  </div>
</template>
<script lang="ts" setup>
  import { onMounted, reactive, ref } from 'vue';
  import PenaltyInfo from '../../components/penaltyInfo.vue';
  const activeKey = ref('1');
  import { useRoute } from 'vue-router';
  import { caseDetail } from '@/api/administrativePenalty/case-management';
  import { approveCase } from '@/api/administrativePenalty/case-approval';
  import { message } from 'ant-design-vue';
  import router from '@/router';
  import { useTable } from '@/components/core/dynamic-table';
  import { useTabsViewStore } from '@/store/modules/tabsView';
  import { getInfo, organizerList } from '@/api/account';

  const tabsViewStore = useTabsViewStore();
  const route = useRoute();
  const chooseFlag = route.query.chooseFlag as any;

  const [DynamicTable, dynamicTableInstance] = useTable();

  const goTask = () => {
    router.push({
      path: '/supervision/task-view',
      query: { id: penaltyData.value.taskId },
    });
  };

  const formRef = ref();
  const labelCol = {
    style: { width: '80px' },
  };
  const formState = reactive({
    nodeStatus: 2, //审批状态；2、同意  3、拒绝
    approveOpinions: '', //审批意见
    organizerId: undefined, //协作人
    organizerName: '',
  });

  const rules = {
    nodeStatus: [
      {
        required: true,
        message: '请选择审批状态',
        trigger: 'change',
      },
    ],
    approveOpinions: [
      {
        required: true,
        message: '请输入审批意见',
        trigger: 'blur',
      },
    ],
    organizerId: [
      {
        required: true,
        message: '请选择协办人',
        trigger: 'change',
      },
    ],
  } as any;

  const cacel = () => {
    router.push({
      path: '/administrative-penalty/administrative-penalty/case-approval',
    });
  };

  const organizerOptions = ref();

  const onSubmit = () => {
    formRef.value
      .validate()
      .then(async () => {
        let params = {
          id: route.query.progressId,
          nodeStatus: formState.nodeStatus,
          approveOpinions: formState.approveOpinions,
          sponsorId: penaltyData.value.sponsorId,
          sponsor: penaltyData.value.sponsor,
          organizerId: penaltyData.value.organizerId,
          organizer: penaltyData.value.organizer,
        };
        if (penaltyData.value?.status == 1 && formState.nodeStatus == 2) {
          params.organizerId = formState.organizerId;
          params.organizer = organizerOptions?.value.filter(
            (item) => item.value == formState.organizerId,
          )[0]?.label;
        }
        const res = await approveCase(params);

        if (res.code == 0) {
          message.success('审批成功');
          tabsViewStore.closeCurrentTabToUrl(
            route,
            '/administrative-penalty/administrative-penalty/case-approval',
          );
        }
      })
      .catch((error) => {
        console.log('error', error);
      });
  };

  const penaltyData = ref();

  //立案审批记录
  const registerList = ref([] as any);

  //案件处理审批记录
  const handleList = ref([] as any);

  //延期/分期审批记录
  const delayList = ref([] as any);

  //案件终止审批记录
  const cancelList = ref([] as any);

  const changeWith = (val) => {
    if (val == '') {
      return 'width: 100%;';
    }
  };

  const caseFlowNodeName = (val) => {
    switch (val) {
      case 1:
        return '主办人';
      case 2:
        return '协办人';
      case 3:
        return '承办单位';
      case 4:
        return '大队法制';
      case 5:
        return '大队长';
      case 6:
        return '立案审批节点';
      default:
        return '-';
    }
  };

  const caseNodeStatus = (val) => {
    switch (val) {
      case 1:
        // return '待审批';
        return '-';
      case 2:
        return '同意';
      case 3:
        return '不同意';
      default:
        return '-';
    }
  };

  const caseStatus = (val) => {
    switch (val) {
      case 2:
        return 0;
      case 3:
        return 1;
      case 4:
        return 2;
      default:
        return 3;
    }
  };

  const caseApproveOpinions = (val) => {
    switch (val) {
      case 2:
        return '';
      case 3:
        return 'approveOpinions';
      default:
        return '';
    }
  };

  const steps = [
    {
      title: '调查取证',
    },
    {
      title: '案件处理',
    },
    {
      title: '结案归档',
    },
  ];

  const columns = [
    {
      title: '节点名称',
      dataIndex: 'flowNodeName',
      hideInSearch: true,
    },
    {
      title: '审批人',
      dataIndex: 'approveName',
      hideInSearch: true,
    },
    {
      title: '审批时间',
      dataIndex: 'approveTime',
      hideInSearch: true,
    },
    {
      title: '审批结果',
      dataIndex: 'nodeStatus',
      hideInSearch: true,
      customRender: ({ record }) => caseNodeStatus(record.nodeStatus),
    },
    {
      title: '审批意见',
      dataIndex: 'approveOpinions',
      hideInSearch: true,
    },
  ];

  const loadData = async (params): Promise<API.TableListResult> => {
    const data = await caseDetail(route.query.id as any, 3);
    penaltyData.value = data;

    registerList.value = penaltyData.value.registerList;
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve({
          list: registerList.value,
          ...params,
        });
      }, 500);
    });
  };

  const loadData2 = async (params): Promise<API.TableListResult> => {
    const data = await caseDetail(route.query.id as any, 3);
    penaltyData.value = data;

    handleList.value = penaltyData.value?.handleList;
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve({
          list: handleList.value,
          ...params,
        });
      }, 500);
    });
  };

  const loadData3 = async (params): Promise<API.TableListResult> => {
    const data = await caseDetail(route.query.id as any, 1);
    penaltyData.value = data;
    if (penaltyData.value.delayList) {
      delayList.value = penaltyData.value.delayList;
    }

    return new Promise((resolve) => {
      setTimeout(() => {
        resolve({
          list: delayList.value,
          ...params,
        });
      }, 500);
    });
  };

  const loadData4 = async (params): Promise<API.TableListResult> => {
    const data = await caseDetail(route.query.id as any, 1);
    penaltyData.value = data;
    if (penaltyData.value.cancelList) {
      cancelList.value = penaltyData.value.cancelList;
    }

    return new Promise((resolve) => {
      setTimeout(() => {
        resolve({
          list: cancelList.value,
          ...params,
        });
      }, 500);
    });
  };

  //立案审批表
  const lafileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //调查取证通知书
  const dcfileInfoData = ref({
    oldFileUrl: '123',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //询问通知书
  const cwfileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //权力义务告知书
  const qlfileInfoData = ref({
    oldFileUrl: '123',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //先行登记保存决定书
  const xxdjfileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //询问笔录列表
  const dcqzfileInfoDataList = ref([] as any);

  //询问笔录列表
  const xwfileInfoDataList = ref([] as any);

  //询问笔录
  const xwfileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //其他
  const otherInfoData = ref([] as any);

  //行政处罚告知笔录
  const xzfileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //行政处罚决定书
  const xzcffileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //行政处罚审批表
  const xzcfspileInfoData = ref({
    oldFileUrl: '123',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //不予行政处罚决定书
  const byxzcffileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //行政处罚延期/分期缴纳罚款决定书
  const yqfqfileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //行政处罚延期/分期缴纳罚款审批表
  const yqfqspfileInfoData = ref({
    oldFileUrl: '123',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //送达回证
  const sdhzfileInfoData = ref({
    oldFileUrl: '123',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //

  //缴纳凭证
  const jnpzfileInfoData = ref({
    oldFileUrl: '123',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //法制审核意见
  const fzshfileInfoData = ref({
    oldFileUrl: '123',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //终止案件调查决定书
  const zzajdcfileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //终止案件调查审批表
  const zzajspfileInfoData = ref({
    oldFileUrl: '',
    newFileUrl: '',
    id: '',
    fileType: '',
  });

  //集体议案
  const jtyafileInfoDataList = ref([] as any);

  //终止案件集体议案书
  const zzajjtInfoDataList = ref([] as any);

  const caseDetailApi = async () => {
    const data = await caseDetail(route.query.id as any, 3);
    penaltyData.value = data;

    if (penaltyData.value.registerList) {
      registerList.value = penaltyData.value.registerList;
    }
    if (penaltyData.value.handleList) {
      handleList.value = penaltyData.value.handleList;
    }

    if (penaltyData.value.stageList.length) {
      penaltyData.value.stageList.map((item) => {
        if (item.stageName == '立案审批表') {
          //立案审批表
          if (item.fileInfoList.length) {
            lafileInfoData.value = item.fileInfoList[0];
          }
        }
        if (item.stageName == '调查取证') {
          dcqzfileInfoDataList.value = item.fileInfoList;
          if (item.fileInfoList.length) {
            item.fileInfoList.map((i) => {
              if (i.fileType == 3) {
                //权力义务告知书
                qlfileInfoData.value = i;
              } else if (i.fileType == 2) {
                //调查取证通知书
                dcfileInfoData.value = i;
              } else if (i.fileType == 4) {
                //先行登记保存决定书
                xxdjfileInfoData.value = i;
              }
            });
          }
        }
        if (item.stageName == '询问笔录') {
          xwfileInfoDataList.value = item.fileInfoList;
          if (item.fileInfoList.length) {
            item.fileInfoList.map((i) => {
              if (i.fileType == 6) {
                //询问通知书
                cwfileInfoData.value = i;
              } else if (i.fileType == 7) {
                //询问笔录
                xwfileInfoData.value = i;
              }
            });
          }
        }
        if (item.stageName == '法制审核') {
          //法制审核意见
          if (item.fileInfoList.length) {
            fzshfileInfoData.value = item.fileInfoList[0];
          }
        }
        if (item.stageName == '集体议案') {
          jtyafileInfoDataList.value = item.fileInfoList;
        }
        if (item.stageName == '其他') {
          otherInfoData.value = item.fileInfoList;
        }
        if (item.stageName == '处罚告知') {
          if (item.fileInfoList.length) {
            xzfileInfoData.value = item.fileInfoList[0];
          }
        }
        if (item.stageName == '处罚文书') {
          if (item.fileInfoList.length) {
            item.fileInfoList.map((i) => {
              if (i.fileType == 13) {
                //行政处罚决定书
                xzcffileInfoData.value = i;
              } else if (i.fileType == 131) {
                //行政处罚审批表
                xzcfspileInfoData.value = i;
              } else if (i.fileType == 14) {
                //不予行政处罚决定书
                byxzcffileInfoData.value = i;
              }
            });
          }
        }
        if (item.stageName == '延期/分期文书') {
          if (item.fileInfoList.length) {
            item.fileInfoList.map((i) => {
              if (i.fileType == 15) {
                //行政处罚延期/分期缴纳罚款决定书
                yqfqfileInfoData.value = i;
              } else if (i.fileType == 151) {
                //行政处罚延期/分期缴纳罚款审批表
                yqfqspfileInfoData.value = i;
              }
            });
          }
        }
        if (item.stageName == '归档文书') {
          item.fileInfoList.map((i) => {
            if (i.fileType == 16) {
              //送达回证
              sdhzfileInfoData.value = i;
            } else if (i.fileType == 17) {
              //缴纳凭证
              jnpzfileInfoData.value = i;
            }
          });
        }
        if (item.stageName == '终止案件集体议案') {
          zzajjtInfoDataList.value = item.fileInfoList;
        }
        if (item.stageName == '终止文书') {
          if (item.fileInfoList.length) {
            item.fileInfoList.map((i) => {
              if (i.fileType == 19) {
                //终止案件调查决定书
                zzajdcfileInfoData.value = i;
              } else if (i.fileType == 191) {
                //终止案件调查审批表
                zzajspfileInfoData.value = i;
              }
            });
          }
        }
      });
    }
  };

  const getBookUrl = (data) => {
    if (data.code == 0) {
      caseDetailApi();
    }
  };

  const organizers = ref({
    type: 0,
  });

  onMounted(async () => {
    caseDetailApi();

    const organizer = await organizerList(organizers.value);

    if (organizer.code === 0) {
      organizerOptions.value = organizer.data.map((item) => {
        return {
          label: item.userName,
          value: item.id,
        };
      });
    }
  });
</script>
<style lang="less" scoped>
  .all {
    background-color: #ffffff;

    &-top {
      &-tittle {
        padding: 0px 0 16px 0;
        font-size: 18px;
        font-weight: 700;
        line-height: 26px;
        color: rgba(68, 68, 68, 1);

        border-bottom: 1px solid rgba(240, 240, 240, 1);
      }
    }

    &-tabs {
      :global(.all-tabs.ant-tabs-top .ant-tabs-nav) {
        margin: 0 0 12px 0 !important;
      }
    }

    .archive {
      width: 100%;

      &-steps {
        width: 100%;
        height: 100px;
        border: 1px solid #f0f0f0;
        display: flex;
        align-items: center;
        padding: 0 300px;
      }

      &-body {
        display: flex;
        justify-content: space-between;
        margin-top: 12px;

        &-left {
          width: 30%;
          border: 1px solid #f0f0f0;
          margin-right: 12px;

          .taskBox {
            width: 100%;
            border-bottom: 1px solid #f0f0f0;

            &-top {
              width: 100%;
              display: flex;
              justify-content: space-between;
              align-items: center;
              padding: 14px 12px;
              background: #fafafa;
              border-bottom: 1px solid #f0f0f0;

              font-size: 14px;
              font-weight: 500;
              color: #444444;
            }
          }

          .taskBox:last-child {
            border-bottom: 0;
          }
        }

        &-right {
          width: 70%;
          border: 1px solid #f0f0f0;
          padding: 0px 18px 0 16px;
        }
      }
    }

    .examine {
      &-body {
        &-box {
          margin: 16px 0;
          &-tittle {
            display: flex;
            align-items: center;
            padding: 13px 0 13px 0;
            &-left {
              border: 1px solid #0f53ac;
              margin-right: 7px;
              border-radius: 4px;
              height: 14px;
            }

            &-right {
              font-size: 16px;
              font-weight: 400;
              line-height: 24px;
              color: rgba(68, 68, 68, 1);
            }
          }

          // &-info {
          // }
        }
      }
    }
    .noData {
      height: 64px;
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }
</style>
